<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <link rel="stylesheet" href="../css/bootstrap.css">

</head>

<body>
    <div id="app" class="container">
        <!-- 1、外层结构 -->
        <div class="dropdown">
            <!-- 2、写button -->
            <button class="btn btn-lg btn-primary dropdown-toggle" id="btn1" data-toggle="dropdown">
                Dropdown
                <span class='caret' />
            </button>
            <!-- 3、写下拉列表 -->
            <ul class="dropdown-menu" aria-labelledby="btn1">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <!--divider类似与hr，分割符 -->
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <!--divider类似与hr，分割符 -->
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
            </ul>
        </div>
    </div>
</body>
<script src="../js/jq-1.12.4.js"></script>
<script src="../js/bootstrap.js"></script>

</html>